<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
	"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-US">
<head>
	<title>Reftest, bug 427129</title>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<meta http-equiv="Content-Style-Type" content="text/css">
	<style type="text/css">

	html, body { margin: 0; }

	.contain {
		background: aqua; color: black;
		height: 4px; margin: 1px 50px;
		padding-top: 0.1px; /* needed for some reason (XXX WHY?) */
	}

	div.pushed { height: 2px; }
	div.t { background: blue; height: 1px; width: 100px; }
	div.caption { background: purple; height: 1px; width: 100px; }
	div.side { display: inline-block; vertical-align: top; }

	</style>
</head>
<body>

<!--
  
  WARNING: Both this test and the reference are constructed to test
  our current behavior, which is far from optimal in a number of cases.
  Fixing the test to test better behavior is encouraged when such
  behavior is implemented.

  To test the behavior under resizing, every test in this page is
  repeated three times, once in a container one pixel above the
  transition width, once at the transition width (just fitting), and
  once in a container a pixel below the transition width.

-->

<div style="width: 405px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 116px"></div>
	</div>
</div>

<div style="width: 404px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 116px"></div>
	</div>
</div>

<div style="width: 403px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 55px"></div>
		<div class="caption" style="margin-left: 115px"></div>
	</div>
</div>

<div style="width: 405px">
	<div class="contain">
		<div class="caption" style="margin-left: 116px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 404px">
	<div class="contain">
		<div class="caption" style="margin-left: 116px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 403px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 116px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 406px">
	<div class="contain">
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 117px"></div>
	</div>
</div>

<div style="width: 405px">
	<div class="contain">
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 117px"></div>
	</div>
</div>

<div style="width: 404px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 117px"></div>
	</div>
</div>

<div style="width: 401px">
	<div class="contain">
		<div class="caption" style="margin-left: 112px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="caption" style="margin-left: 112px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 399px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 112px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 401px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 112px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 112px"></div>
	</div>
</div>

<div style="width: 399px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 55px"></div>
		<div class="caption" style="margin-left: 111px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 111px"></div>
	</div>
</div>

<div style="width: 399px">
	<div class="contain">
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 111px"></div>
	</div>
</div>

<div style="width: 398px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 56px"></div>
		<div class="caption" style="margin-left: 111px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="caption" style="margin-left: 111px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 399px">
	<div class="contain">
		<div class="caption" style="margin-left: 111px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 398px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 110px"></div>
		<div class="t" style="margin-left: 55px"></div>
	</div>
</div>

<div style="width: 402px">
	<div class="contain">
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 113px"></div>
	</div>
</div>

<div style="width: 401px">
	<div class="contain">
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 113px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 57px"></div>
		<div class="caption" style="margin-left: 113px"></div>
	</div>
</div>

<div style="width: 402px">
	<div class="contain">
		<div class="caption" style="margin-left: 113px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 401px">
	<div class="contain">
		<div class="caption" style="margin-left: 113px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 400px">
	<div class="contain">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 113px"></div>
		<div class="t" style="margin-left: 56px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side caption" style="margin-left: 155px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 655px">
	<div class="contain">
		<div class="side caption" style="margin-left: 155px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 654px">
	<div class="contain">
		<div class="side caption" style="margin-left: 155px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 657px">
	<div class="contain">
		<div class="side caption" style="margin-left: 156px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side caption" style="margin-left: 156px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 655px">
	<div class="contain">
		<div class="side caption" style="margin-left: 156px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 658px">
	<div class="contain">
		<div class="side caption" style="margin-left: 157px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 657px">
	<div class="contain">
		<div class="side caption" style="margin-left: 157px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side caption" style="margin-left: 157px"></div
		><div class="side t" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 657px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 655px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 657px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 655px">
	<div class="contain">
		<div class="side t" style="margin-left: 56px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 658px">
	<div class="contain">
		<div class="side t" style="margin-left: 57px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 657px">
	<div class="contain">
		<div class="side t" style="margin-left: 57px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 656px">
	<div class="contain">
		<div class="side t" style="margin-left: 57px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 425px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 152px"></div>
		<div class="caption" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 424px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 151px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 423px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 151px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 425px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 72px"></div>
		<div class="t" style="margin-left: 152px"></div>
	</div>
</div>

<div style="width: 424px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 71px"></div>
		<div class="t" style="margin-left: 151px"></div>
	</div>
</div>

<div style="width: 423px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 70px"></div>
		<div class="t" style="margin-left: 150px"></div>
	</div>
</div>

<div style="width: 426px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 152px"></div>
		<div class="caption" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 425px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 151px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 424px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 150px"></div>
		<div class="caption" style="margin-left: 70px"></div>
	</div>
</div>

<div style="width: 418px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 72px"></div>
		<div class="t" style="margin-left: 145px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 71px"></div>
		<div class="t" style="margin-left: 144px"></div>
	</div>
</div>

<div style="width: 416px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 70px"></div>
		<div class="t" style="margin-left: 143px"></div>
	</div>
</div>

<div style="width: 418px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 145px"></div>
		<div class="caption" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 144px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 416px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 144px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 144px"></div>
		<div class="caption" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 416px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 143px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 415px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 142px"></div>
		<div class="caption" style="margin-left: 70px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 72px"></div>
		<div class="t" style="margin-left: 144px"></div>
	</div>
</div>

<div style="width: 416px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 71px"></div>
		<div class="t" style="margin-left: 143px"></div>
	</div>
</div>

<div style="width: 415px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 71px"></div>
		<div class="t" style="margin-left: 143px"></div>
	</div>
</div>

<div style="width: 419px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 145px"></div>
		<div class="caption" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 418px">
	<div class="contain rtl">
		<div class="t" style="margin-left: 144px"></div>
		<div class="caption" style="margin-left: 71px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="t" style="margin-left: 143px"></div>
		<div class="caption" style="margin-left: 70px"></div>
	</div>
</div>

<div style="width: 419px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 72px"></div>
		<div class="t" style="margin-left: 146px"></div>
	</div>
</div>

<div style="width: 418px">
	<div class="contain rtl">
		<div class="caption" style="margin-left: 71px"></div>
		<div class="t" style="margin-left: 145px"></div>
	</div>
</div>

<div style="width: 417px">
	<div class="contain rtl">
		<div class="pushed"></div>
		<div class="caption" style="margin-left: 70px"></div>
		<div class="t" style="margin-left: 144px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 201px"></div
		><div class="side t" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 672px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 200px"></div
		><div class="side t" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 671px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 199px"></div
		><div class="side t" style="margin-left: 72px"></div>
	</div>
</div>

<div style="width: 674px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 201px"></div
		><div class="side t" style="margin-left: 73px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 200px"></div
		><div class="side t" style="margin-left: 73px"></div>
	</div>
</div>

<div style="width: 672px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 199px"></div
		><div class="side t" style="margin-left: 73px"></div>
	</div>
</div>

<div style="width: 675px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 201px"></div
		><div class="side t" style="margin-left: 74px"></div>
	</div>
</div>

<div style="width: 674px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 200px"></div
		><div class="side t" style="margin-left: 74px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<!-- margins showing up in the wrong places? -->
		<div class="side caption" style="margin-left: 199px"></div
		><div class="side t" style="margin-left: 74px"></div>
	</div>
</div>

<div style="width: 674px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 101px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 100px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 672px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 99px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 674px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 101px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 100px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 672px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 99px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 675px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 101px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 674px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 100px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

<div style="width: 673px">
	<div class="contain rtl">
		<div class="side t" style="margin-left: 99px"></div
		><div class="side caption" style="margin-left: 100px"></div>
	</div>
</div>

</body>
</html>
